<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Timeline</title>
        <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
        <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <!-- CSS -->
        <link href="static/css/timeline.css" rel="stylesheet">
        <style>
            html, body {
                height:100%;
                padding: 0px;
                margin: 0px;
            }
        </style>
        <script type="text/javascript" src="static/js/jquery-min.js"></script>
        <!--script type="text/javascript" src="static/js/easing.js"></script>
        <script type="text/javascript" src="static/js/timeline.js"></script>
        <script type="text/javascript" src="static/js/timeline-embed.js"></script>
        <script type="text/javascript" src="static/js/bootstrap-tooltip.js"></script>
        <script type="text/javascript" src="static/js/lazyload.js"></script>
        <script type="text/javascript" src="static/js/VMM.Core.js"></script>
        <script type="text/javascript" src="static/js/VMM.js"></script>
        <script type="text/javascript" src="static/js/VMM.LoadLib.js"></script>
        <script type="text/javascript" src="static/js/VMM.Util.js"></script-->
        <script type="text/javascript" src="static/js/timeline-min.js"></script>
        <script>
            $(document).ready(function() {
                var timeline = new VMM.Timeline();
                timeline.init();
            });
            //background-color:#F3F3F3
        </script>
    </head>
    <body>
        <div id="timeline">
            <section>										<!-- Timeline Start Screen -->
                <time>1977,5,11</time>								<!-- Timeline Begins Date -->
                <h2>The Main Timeline Headline</h2>						<!-- Main Headline -->
                <article>									<!-- Main Text -->
                    <p>The main text goes here. You can have p tags or anything really.</p>
                </article>
                <figure>
                    <img src="final.jpg">							<!-- Media, can also be a link to youtube video etc (optional) -->
                    <cite>John Doe/Millennium Magazine</cite>                                   <!-- Credit for media (optional) -->
                    <figcaption>Caption goes here.</figcaption>                                 <!-- Caption for media (optional) -->
                </figure>
            </section>
            <ul>
                <!-- Event -->
                <li>
                    <time>1978,5,11</time>							<!-- Event Date -->
                    <time>1978,8,11</time>							<!-- End of Event (optional) -->
                    <h3>Headline Goes Here</h3>							<!-- Headline -->
                    <article>									<!-- Main Text -->
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">							<!-- Media, can also be a link to youtube video etc (optional) -->
                        <cite>John Doe/Millennium Magazine</cite>                               <!-- Credit for media (optional) -->
                        <figcaption>Caption goes here.</figcaption>                             <!-- Caption for media (optional) -->
                    </figure>
                </li>
                <!-- / Event -->
                <li>
                    <time>1978,5,13</time>
                    <time>1978,5,19</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <a href="http://youtu.be/vjVfu8-Wp6s">Anything</a>
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1978,5,16</time>
                    <time>1978,5,11</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1978,5,18</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1978,6,18</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1978,5,19</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1978,8,18</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
                <li>
                    <time>1979,8,18</time>
                    <h3>Headline Goes Here</h3>
                    <article>
                        <p>The main text goes here. You can have p tags too.</p>
                    </article>
                    <figure>
                        <img src="final.jpg">
                        <cite>John Doe/Millennium Magazine</cite>
                        <figcaption>Caption goes here.</figcaption>
                    </figure>
                </li>
            </ul>
        </div>
    </body>
</html>
